<%@ page isELIgnored="false" contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"></c:set>
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>55社区</title>
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta name="renderer" content="webkit">
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="icon" type="image/png" href="/theme/default/images/favicon.png">
<link href="${ctx}/static/phone/css/amazeui.min.css" rel="stylesheet" type="text/css" />
<link href="${ctx}/static/phone/css/style.css" rel="stylesheet" type="text/css" />
<script src="${ctx}/static/phone/js/jquery-1.10.2.min.js"></script>

<head></head>
<body>
<header data-am-widget="header" class="am-header am-header-default sq-head ">
    <div class="am-header-left am-header-nav">
        <a href="javascript:history.back()" class="">
            <i class="am-icon-chevron-left"></i>
        </a>
    </div>
    <h1 class="am-header-title">
        <a href="" class="">购物车</a>
    </h1>
</header>
<div style="height: 49px;"></div>
<!--购物车空的状态-->
<div class="login-logo">
    <img src="${ctx}/static/phone/images/logo.png">
    <p></p>
    <a href="/index/goods_list.do" class="goshopping">前去逛逛</a>
</div>
<ul class="shopcart-list">
    <c:forEach var="shopcar" items="${shopcartList}">
        <li id="shop-car" >
            <label class="am-checkbox am-warning">
                <input type="checkbox" checked="checked" class="single" id="shopcarId" value="${shopcar.shopcart_id}" data-am-ucheck checked>
            </label>
            <a href="goods_detail.do?id=${shopcar.goods_id}"><img src="${ctx}/static/phone/${shopcar.goods_img}" class="shop-pic" /></a>
            <div class="shop-list-mid">
                <div class="tit"><a href="goods_detail.do?id=${shopcar.goods_id}">${shopcar.goods_name}</a></div>
                <div class="d-stock">
                    <a class="decrease">-</a>
                    <input id="num2" readonly="" class="text_box" name="" type="text" value="${shopcar.goods_num}">
                    <a class="increase">+</a>
                </div>
            </div>
            <b class="shop-list-price">￥<span class="price">${shopcar.goods_price}</span> </b>
            <div class="del">
                <a class="am-icon-trash"></a>
            </div>
        </li>
    </c:forEach>


    <div style="height: 10px; background: #eee;"></div>
</ul>

<div class="shop-fix">

    <label class="am-checkbox am-warning">
        <input type="checkbox" checked="checked" value="" data-am-ucheck checked>
    </label>
    <a class="delArr" onclick="DelSelect()">批量删除</a>
    <a  href="javascript:void(0)" class="js-btn">去结算</a>
    <div class="js-text">
        <P>合计：<b id="total">￥</b></P>
        <p class="js-car">免费配送</p>
    </div>
</div>

<!--底部-->
<jsp:include page="commonBottom.jsp"></jsp:include>

<script>

    function DelSelect(){
        var Checkbox=false;
        var ids = new Array();//声明一个数组
        $('.single:checked').each(function(){
            if (this.checked==true) {
                Checkbox=true;
                var id = $(this).val();//取出值
                ids.push(id);//加入数组
            }
        });
        console.info("ids="+ids)
        if (Checkbox){
            var t=confirm("您确认要删除选中的内容吗？");
            if (t) {
                window.location.href="${ctx}/category/batchDelete.do?ids="+ids;
            }else{
                return false;
            }
        }
        else{
            alert("请选择您要删除的内容!");
            return false;
        }
    }

    $(function () {
        $(".js-btn").click(function () {
            var Checkbox=false;
            var ids=new Array();//声明一个数组
            $(".single:checked").each(function () {
                Checkbox=true;
                var id=$(this).val();//取出值
                ids.push(id);//加入数组
            });
            if (Checkbox){
                var t=confirm("您确认要结算选中的内容吗？");
                if (t==false) {
                    return false;
                }else{
                   window.location.href="${ctx}/category/submitCar.do?ids="+ids;
                }
            }else{
                alert("请选择您要结算的内容!");
                return false;
            }
        });
    });
    //计算总金额
    function money() {
        var money = 0;
        $(".shopcart-list li").each(function (index) {
            var price = parseFloat($(this).find('.price').html()); //获取商品单价
            var num = parseFloat($(this).find('.text_box').val()); //获取商品数量
            money += price * num;
        })
        $("#total").text(money);
    }
    $(".del").click(function () {
        var id = $(this).parent().find("#shopcarId").val();
        var mydata={"id":id};
        $.post("${ctx}/category/deleteCar.do",mydata,function () {

        },"json");
        $(this).parent("li").remove();
        setTimeout(function () {
            window.location.reload()
        },1000)
        money();
    })

    function ajaxUpdate(num,id){
        var data={
            "id":id,
            "num":num
        }
        $.get("${ctx}/category/goods_carUpdate.do",data)
        money();
    }
    //购物数量加减
    $(function(){
        $('.increase').click(function(){
            var self = $(this);
            var current_num = parseInt(self.siblings('input').val());
            current_num += 1;
            self.siblings('input').val(current_num);
            (self.siblings('input').data('item-id'));
            var id = self.parent().parent().parent().find("#shopcarId").val();
            ajaxUpdate(current_num,id);

        })
        money();
        $('.decrease').click(function(){
            var self = $(this);
            var current_num = parseInt(self.siblings('input').val());
            if(current_num > 1){
                current_num -= 1;
                self.siblings('input').val(current_num);
                (self.siblings('input').data('item-id'));
            }
            var id = self.parent().parent().parent().find("#shopcarId").val();
            console.info(id)
            console.info(current_num)
            ajaxUpdate(current_num,id);
            money();
        })
    })

</script>
<script src="${ctx}/static/phone/js/jquery.min.js"></script>
<script src="${ctx}/static/phone/js/amazeui.min.js"></script>
</body>
</html>
